@charset "utf-8";
/* CSS Document */
.navbar,
body { background: #333; }
a { text-decoration: none; }

a:link { color:#F93; }
a:visited { color:#F93; }
a:hover { color:#993; }
a:active { color:#F93; }

.add-relative {
	position: relative;
}

footer {
	color: #FFF;
	text-align: center;
}
* {
	word-wrap: break-word;
}






.my-header {
	height: 150px;
	overflow: hidden;
}
.my-header-logo {
	width: 100%;
	height: auto;
}



.my-nav a:link { color:#FFF; }
.my-nav a:visited { color:#FFF; }
.my-nav a:hover { color:#033; }
.my-nav a:active { color:#033; }
.my-active {
	background-color: #F93;
}




.my-main-icon>img {
	width: 100%;
	height: auto;
}
.my-icon {
	width: 20px;
	height: 20px;
	border-radius: 50%;
}
.my-main-name {
	margin: 20px;
}
.my-carousel-ol {
	margin-bottom: 0px;
	position: absolute;
	bottom: 0px;
}










.my-blog {

}
.my-blog-title {
	color: #993;
	font-weight: 900;
	font-size: 20px;
}
.my-blog-title a { text-decoration: none; }
.my-blog-title a:link { color:#993; }
.my-blog-title a:visited { color:#993; }
.my-blog-title a:hover { color:#993; }
.my-blog-title a:active { color:#993; }
.my-blog-time {
	color: #CC9;
	font-size: 9px;
}
.my-share {
	text-align: right;
}
.my-share a:link { color:#F93; }
.my-share a:visited { color:#F93; }
.my-share a:hover { color:#F93; }
.my-share a:active { color:#F93; }
.my-button {
	background: #FF9;
	border: 1px solid #F93;
}
.my-blog-img {
	text-align: center;
	margin: 10px 0px;
}
.my-blog-img img {
	height: 100px;
}
.my-blog hr {
	border-top: 1px solid #993;
}
.my-more {
	text-align: right;
}
.my-more a {
	text-decoration: none;
}



.my-panel-ragb { background: rgba(255, 255, 255, 0.4); }
.my-panel-ragb a:link {}
.my-panel-ragb a:visited {}
.my-panel-ragb a:hover { color: #F93; }
.my-panel-ragb a:active {}






.my-other,
#the-about {
	text-align: center;
}
#the-about ul {
	list-style: none;
	padding: 0px;
}
#the-about li>img,
#the-about li>span {
	margin: 10px;
}





audio {
	width: 100%;
}





#my-blog-more {
	text-align: center;
}


.my-star {
	position: relative;
	width: 50px;
	height: 50px;
}
.my-star>img {
	width: 100%;
	position: absolute;
}
#star001 {
	position: absolute;
	left: 350px;
	top: 60px;
}
#star002 {
	width: 20px;
	height: 20px;
	position: absolute;
	left: 200px;
	top: 100px;
}
#star003 {
	position: absolute;
	left: 600px;
	top: 60px;
}
#star004 {
	position: absolute;
	left: 500px;
	top: 100px;
}
#star005 {
	position: absolute;
	left: 900px;
	top: 90px;
}




/* about about about about about about about about about about about about about about about about about */

#about-izaya {
	background: #FFF;
}
.my-about-img img {
	width: 100%;
}
.the-audio-button {
	position: relative;
	text-align: center;
}
.the-audio-button>.at-left {
	position: absolute;
	left: 0px;
}
.the-audio-button>.at-right {
	position: absolute;
	right: 0px;
}
.the-audio-button>.at-centre {
	visibility: hidden;
}
.izaya-list-title {
	margin: 5px;
}
.my-audio-button {
	margin-top: 10px;
	padding: 5px;
	border: none;
	border-radius: 5px;
	background: #333;
	color: #FFF;
}






.goto-left {
	position: absolute;
	width: 30px;
	height: 30px;
	background: #FFF;
	transform: matrix(0.5,0.5,-0.5,0.5,-30,0);
}
.goto-right {
	position: absolute;
	right: 0px;
	width: 30px;
	height: 30px;
	background: #FFF;
	transform: matrix(0.5,0.5,-0.5,0.5,0,0);
}


/*information information information information information information information information*/
.my-left-btn {
	width: 100%;
	/*text-align: left;*/
}
.my-list-group-item {
	border: #F93 solid 1px;
}
.my-label-star {
	margin-right: 20px;
	width: 20px;
	height: 20px;
}
#my-left-menu {
	position: fixed;
}
.new-my-left-menu {
	position: fixed;
	left: 7%;
	top: 50px;
	visibility: visible;
}
.be-visible {
	visibility: hidden;
}
/*message message message message message message message message message message message message message*/
.message-paopao {
	padding: 10px;
	color: #960;
	font-size: 20px;
}